<template>
  <el-dialog
    width="100%"
    top="0px"
    :fullscreen="true"
    :title="this.title"
     class="label_font"
    :close-on-click-modal="false"
    :visible.sync="visible">
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="160px">

    <el-row  >
      <el-col :span="12"   >
            <el-form-item label="业务件号" prop="serviceno" class="label_font" >
              <el-input v-model="dataForm.serviceno" placeholder="业务件号" :readonly="true"  style="100%"></el-input>
            </el-form-item>
      </el-col>

      <el-col :span="12">
          <el-form-item label=" 不动产登记证明号" prop="realtyno" class="label_font">
            <el-input v-model="dataForm.realtyno" placeholder=" 不动产登记证明号" :readonly="true"  style="100%"></el-input>
          </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="12">
          <el-form-item label="注销类型" prop="dyfs" class="label_font">
            <el-select v-model="dataForm.dyfs" placeholder="注销类型" :disabled=true style="width:100%">
             <el-option
                v-for="item in dataForm.cancelTypeList"
                :key="item.value"
                :label="item.text"
                :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
      </el-col>
      <el-col :span="12">
          <el-form-item label="注销原因" prop="zxyy" class="label_font">
            <el-select v-model="dataForm.zxyy" placeholder="注销原因" 
              :disabled="step == 1"  style="width:100%">
             <el-option
                v-for="item in dataForm.cancelReasonList"
                :key="item.value"
                :label="item.text"
                :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="12">
          <el-form-item label="抵押权人名称" prop="dyqrname" class="label_font">
             <el-input v-model="dataForm.dyqrname" placeholder=" 抵押权人名称" :readonly="true"  style="100%"></el-input>
          </el-form-item>
      </el-col>
      <el-col :span="12">
          <el-form-item label="主债权担保金额(万元)" prop="bdbzqse" class="label_font">
   <el-input v-model="dataForm.bdbzqse" placeholder=" 主债权担保金额(万元)" :readonly="true"  style="100%"></el-input>
          </el-form-item>
      </el-col>
    </el-row>

        <el-row >
      <el-col :span="12">

        <el-form-item label="地市" prop="seRegion">
          <el-select  @change="selectChanged" v-model="dataForm.seRegion" placeholder="地市" style="width:100%"
          :disabled="step == 1"  >
              <el-option
                v-for="item in dataForm.seRegionList"
                :key="item.code"
                :label="item.name"
                :value="item.code">
              </el-option>
          </el-select>
        </el-form-item>
      </el-col>

      <el-col :span="12">
          <el-form-item label="区县" prop="region">
            <el-select  @change="selectChanged2" v-model="dataForm.region" placeholder="区县" style="width:100%"
            :disabled="step == 1"  >
                <el-option
                  v-for="item in dataForm.regionList"
                  :key="item.code"
                  :label="item.name"
                  :value="item.code">
                </el-option>
            </el-select>
          </el-form-item>
      </el-col>
    </el-row>
  

    <el-row>

      <el-col :span="12">
        <el-form-item label="办理点" prop="site" class="label_font">
          <el-select v-model="dataForm.site" placeholder="办理点" style="width:100%" :disabled="step == 1"   >
                <el-option
                  v-for="item in dataForm.siteList"
                  :key="item.siteno"
                  :label="item.sitename"
                  :value="item.siteno">
                </el-option>
            </el-select>
        </el-form-item>
      </el-col>

      <el-col :span="12">
          <el-form-item label="债务人" prop="zwr" class="label_font">
            <el-input v-model="dataForm.zwr" placeholder="债务人" :readonly=true></el-input>
          </el-form-item>
      </el-col>

    </el-row>    

    <el-row>

      <el-col :span="12">
          <el-form-item label="债务履行开始日期" prop="zwlxqssj" class="label_font">
            <el-date-picker v-model="dataForm.zwlxqssj" placeholder="债务履行开始日期"  :readonly="true"  
           type="datetime" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss"  style="width:100%" ></el-date-picker>
          </el-form-item>
      </el-col>

      <el-col :span="12">
          <el-form-item label="债务履行结束日期" prop="zwlxjssj" class="label_font">
            <el-date-picker v-model="dataForm.zwlxjssj" placeholder="债务履行开始日期"  :readonly="true" 
             type="datetime" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss" style="width:100%" ></el-date-picker>
          </el-form-item>
      </el-col>

    </el-row>


    <el-row>
      <el-col :span="12">
        <el-form-item label="抵押权人证件类别" prop="dyqrzjlb" class="label_font">
          <el-select v-model="dataForm.dyqrzjlb" placeholder="抵押权人证件类别" style="width:100%" :disabled=true >
                <el-option
                  v-for="item in dataForm.zjlbList"
                  :key="item.value"
                  :label="item.text"
                  :value="item.value">
                </el-option>
            </el-select>
        </el-form-item>
      </el-col>

      <el-col :span="12">
          <el-form-item label="抵押权人证件号码" prop="dyqrzjhm" class="label_font">
            <el-input v-model="dataForm.dyqrzjhm" placeholder="抵押权人证件号码" :readonly=true></el-input>
          </el-form-item>
      </el-col>
    </el-row>  

    <el-row>
      <el-col :span="12">
        <el-form-item label="询问：是否真实表示" prop="left1" class="label_font">
            <el-radio-group v-model="dataForm.left1"  :disabled="step == 1"  >
               <el-radio label="1">是</el-radio>
               <el-radio label="0">否</el-radio>
             </el-radio-group>
        </el-form-item>
      </el-col>

            <el-col :span="12">
        <el-form-item label="询问：是否共有房屋" prop="left2" class="label_font">
            <el-radio-group v-model="dataForm.left2"  :disabled="step == 1"  >
               <el-radio label="1">是</el-radio>
               <el-radio label="0">否</el-radio>
             </el-radio-group>
        </el-form-item>
      </el-col>
    </el-row>  

    <el-row>
      <el-col :span="12">
        <el-form-item label="复核结果" prop="checkresult" 
           :class="{ 'is-required': step == 1 }"
          class="label_font" v-if="step == 1">
            <el-radio-group v-model="dataForm.checkresult"   >
               <el-radio label="1">复核通过</el-radio>
               <el-radio label="2">复核不通过</el-radio>
             </el-radio-group>
        </el-form-item>
      </el-col>

      <el-col :span="12">
        <el-form-item label="复核不通过理由" prop="rejectreason" class="label_font"
         :class="{ 'is-required': step == 1 && dataForm.checkresult == 2 }"
         v-if="step == 1 && dataForm.checkresult == 2">
          <el-input v-model="dataForm.rejectreason" placeholder="复核不通过理由" ></el-input>
        </el-form-item>
      </el-col>
    </el-row> 


    <el-row>
      <el-col :span="12">

        <el-form-item label="附记" prop="fj" class="label_font">
              <el-input v-model="dataForm.fj" placeholder="附记"  style="width:100%" ></el-input>
        </el-form-item>

      </el-col>
    </el-row>


<el-row >
          <el-col :span="24">

    <el-table
      :data="bdcxxList"
      border
      v-loading="dataListLoading"
      type="index"
      @selection-change="selectionChangeHandle"
      style="width: 100%;">

        <el-table-column
            prop="realtyunitno"
            header-align="center"
            align="center"
            label="不动产单元号">
        </el-table-column>

        <el-table-column
            prop="realtycertno"
            header-align="center"
            align="center"
            label="不动产权证号">

        </el-table-column>
        <el-table-column
            prop="zl"
            header-align="center"
            align="center"
            label="不动产坐落">
        </el-table-column>

        <el-table-column
            prop="mj"
            header-align="center"
            align="center"

            label="面积">
        </el-table-column>



        </el-table>


          </el-col>
        </el-row>
    <el-row >
    <el-col :span="24">

    <el-table
      :data="dyrList"
      border
      v-loading="dataListLoading"
      @selection-change="selectionChangeHandle"
      style="width: 100%;">

        <el-table-column
            prop="MC"
            header-align="center"

            align="center"
            label="抵押人名称">

        </el-table-column>


        <el-table-column
            prop="ZJLB"
            header-align="center"
            align="center"
            label="抵押人证件类别">
        </el-table-column>

        <el-table-column
            prop="ZJHM"
            header-align="center"
            align="center"
            label="抵押人证件号码">
        </el-table-column>

        </el-table>


          </el-col>
        </el-row>


  

    </el-form>
    <span slot="footer" class="dialog-footer"> 
        <el-button type="primary" @click="submit()">确认</el-button>
      <el-button @click="visible = false">返回</el-button>

    </span>
  </el-dialog>
</template>

<script>
  export default {
    data () {
    var validateCheckresult = (rule, value, callback) => {
        if (!value && this.step == 1) {
          callback(new Error('复核结果不能为空'))
        } else {
          callback()
        }
      }

      var validateRejectreason = (rule, value, callback) => {
        if (!value && this.step == 1) {
          callback(new Error('复核不通过理由不能为空'))
        } else {
          callback()
        }
      }

      return {

        visible: false,
        url: '',
        title: '',
     
        dataListLoading: false,
        dyrList: [],
        bdcxxList: [],
        seqno: 0,
        step: 0,


        dataForm: {
          seqno: 0,
          serviceno: '',
          checkresult: 0,
          realtyunitno: '',
          region: '',
          seRegion: '',

          siteList: [],
          zwr: '',
          cancelReasonList: [],
          cancelTypeList:[],
          seRegionList: [],
          regionList:[],
          zjlbList: [],

          dyqrname: '',
          bdbzqse: '',
          dyqrzjhm: '',
          zwlxqssj: '',
          zwlxjssj: '',
          dyqrzjlb: '',
          dyfs: '',

          site: '',

          zxyy: '',

          left1: '',
          left2: '',
          fj: ''

        },
        dataRule: {
          
          rejectreason:[
              { validator: validateRejectreason, trigger: 'blur' }
          ],
          checkresult:[
              { validator: validateCheckresult, trigger: 'blur' }
          ],
          site: [
            { required: true, message: '办理点不能为空', trigger: 'blur' }
          ],
          zxyy: [
            { required: true, message: '注销原因不能为空', trigger: 'blur' }
          ],
          left1: [
            { required: true, message: '是否真实表示不能为空', trigger: 'blur' }
          ],
          left2: [
            { required: true, message: '是否共有房屋不能为空', trigger: 'blur' }
          ],
          seRegion: [
            { required: true, message: '不动产所属地市不能为空', trigger: 'blur' }
          ],
          region: [
            { required: true, message: '不动产所属区县不能为空', trigger: 'blur' }
          ]
        }
      }
    },
    methods: {
      init (step, id, ywjh, realtyno, region) {
        this.dataForm.seqno = 0
        this.seqno = 0
        if (step == 0){
           this.dataForm.seqno = id
        }else{
          this.seqno = id
        }

  
        this.visible = true
        this.dataForm.gettype = '电子证明';
        this.step = step;
        this.title = '抵押权注销登记';
        if (step == 1){
           this.title += '（复核）';
        }else if (step == 2){
           this.title = '预购商品房预告登记 （重新提交）';
        }
        
        this.$http({
          url: this.$http.adornUrl(`/bdc/cancelregist/item/list`),
              method: 'get',
              params: this.$http.adornParams()
          }).then(({data}) => {
            if (data && data.code === 0) {
                this.dataForm.cancelReasonList = data.cancelReasonList
                this.dataForm.seRegionList = data.regionList
                this.dataForm.cancelTypeList = data.cancelTypeList
                this.dataForm.zjlbList = data.idTypeList
            }
        })

        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields()
      
            this.dataListLoading = true;
            if (step == 0){
              this.$http({
                url: this.$http.adornUrl(`/bdc/cancelregist/query/realtyinfo`),
                method: 'post',
                data: this.$http.adornData({
                  'cxorgid' : id,
                  'ywjh': ywjh,
                  'bdcdjzmh': realtyno,
                  'region': region
                })
              }).then(({data}) => {
                if (data && data.code === 0) {

                  this.dataForm.seqno = data.realtyinfo.serialno
                  this.dataForm.seRegion = data.seRegion
                  var region = data.realtyinfo.region
                  this.selectChanged(this.dataForm.seRegion)
                  this.selectChanged2(region)
                  this.dataForm.region = region

                  this.dataForm.serviceno = data.realtyinfo.serviceno
                  this.dataForm.realtyno = data.realtyinfo.realtyno

                  this.dataForm.dyqrname = data.realtyinfo.dyqrname
                  this.dataForm.bdbzqse = data.realtyinfo.bdbzqse
                  this.dataForm.dyqrzjhm = data.realtyinfo.dyqrzjhm
                  this.dataForm.zwlxqssj = data.realtyinfo.zwlxqssj
                  this.dataForm.zwlxjssj = data.realtyinfo.zwlxjssj
                  this.dataForm.dyqrzjlb = data.realtyinfo.dyqrzjlb
                  this.dataForm.dyfs = data.realtyinfo.dyfs
               

                  this.dyrList = data.dyrList
                  this.bdcxxList = data.bdcxxList
                  this.dataForm.zwr = data.zwr

                }
                this.dataListLoading = false;
              })
            }
            else{
                  var url = this.step == 2 ? '/bdc/cancelregist/info/' : '/bdc/cancelcheck/info/'
                  this.$http({
                  url: this.$http.adornUrl(url + this.seqno),
                  method: 'get',
                  params: this.$http.adornParams()
                }).then(({data}) => {
                  if (data && data.code === 0) {

                  this.dataForm.seRegion = data.bdcMortgregist.seRegion
                  var region = data.bdcMortgregist.region
                  this.selectChanged(this.dataForm.seRegion)
                  this.selectChanged2(region)
                  this.dataForm.region = region

                  this.dataForm.serviceno = data.bdcMortgregist.ydywjh
                  this.dataForm.realtyno = data.bdcMortgregist.ydbdcdjzmh

                  this.dataForm.dyqrname = data.dyqr.MC
                  this.dataForm.bdbzqse = data.bdcMortgregist.bdbzqse
                  this.dataForm.dyqrzjhm = data.dyqr.ZJHM
                  this.dataForm.zwlxqssj = data.bdcMortgregist.zwlxqssj
                  this.dataForm.zwlxjssj = data.bdcMortgregist.zwlxjssj
                  this.dataForm.dyqrzjlb = data.dyqr.ZJLB
                  this.dataForm.dyfs = data.dyfs
                  this.dataForm.site = data.bdcMortgregist.bld

                  this.dyrList = data.dyrList
                  this.bdcxxList = data.bdcxxList
                  this.dataForm.zwr = data.zwr
                  if (data.dyqrXwbl){
                     this.dataForm.left1 = data.dyqrXwbl.SFYYZS
                     this.dataForm.left2 = data.dyqrXwbl.SFGY
                  }

                  this.dataForm.zxyy = data.bdcMortgregist.zxyy
                  this.dataForm.fj = data.bdcMortgregist.fj

                  }
                  this.dataListLoading = false;
                })
            }
            
          
        })
      },





      // 多选
      selectionChangeHandle (val) {
        this.dataListSelections = val
      },

      selectChanged(value){
          this.dataForm.region = '';
          this.$http({
          url: this.$http.adornUrl(`/sys/bdcregion/listByLevle`),
              method: 'get',
              params: this.$http.adornParams({'upregion':value})
          }).then(({data}) => {
            if (data && data.code === 0) {
              this.dataForm.regionList = data.list
            }
        })
      },

      selectChanged2(value){
          this.dataForm.site = ''
          this.$http({
          url: this.$http.adornUrl(`/bdc/bdcsiteinfo/query/` + value),
              method: 'get',
              params: this.$http.adornParams()
          }).then(({data}) => {
            if (data && data.code === 0) {
              this.dataForm.siteList = data.siteList
            }
        })
      },

     
      downApply(){

      },

      submit(){
          this.$refs['dataForm'].validate((valid) => {
            if (valid) {
              if (this.step == 1){


            this.$http({
                url: this.$http.adornUrl('/bdc/cancelcheck/docheck'),
                method: 'post',
                data: this.$http.adornData({
                  'seqno': this.seqno,
                  'checkresult': this.dataForm.checkresult,
                  'rejectreason': this.dataForm.rejectreason,
                  'fj': this.dataForm.fj
                })
              }).then(({data}) => {
                if (data && data.code === 0) {
                  this.$message({
                    message: '操作成功',
                    type: 'success',
                    duration: 1500,
                    onClose: () => {
                      this.visible = false
                      this.$emit('refreshDataList')
                    }
                  })
                } else {
                  this.$message.error(data.msg)
                }
              })  

              }else{
                
              this.$http({
                url: this.$http.adornUrl('/bdc/cancelregist/submitToCheck'),
                method: 'post',
                data: this.$http.adornData({
                  'seqno': this.seqno,
                  'bld': this.dataForm.site,
                  'seRegion': this.dataForm.seRegion,
                  'region': this.dataForm.region,
                  'realtyinfono':this.dataForm.seqno,
                  'sfyyzs': this.dataForm.left1,
                  'sfgy': this.dataForm.left2,
                  'zxyy': this.dataForm.zxyy,
                  'fj': this.dataForm.fj
                })
              }).then(({data}) => {
                if (data && data.code === 0) {
                  this.$message({
                    message: '操作成功',
                    type: 'success',
                    duration: 1500,
                    onClose: () => {
                      this.visible = false
                      this.$emit('refreshDataList')
                    }
                  })
                } else {
                  this.$message.error(data.msg)
                }
              })  


              }
                
            }
            else{
              this.$message.error("参数校验失败")
            }
          })
      }


    }
  }
</script>
<style>
.el-input.is-disabled .el-input__inner {
    background-color: #f5f7fa;
    border-color: #e4e7ed;
    color: #313b50;
    cursor: not-allowed;
}
</style>